<template>
  <div class="app">
    <!--导航栏-->
    <div style=" width: 100%;
    height: 74px;
    background-color: #1c52e4;
    box-shadow: 1px 1px 10px #eaeaea;">
    <Header></Header>
    </div>
    <div class="bac_main" style="height: 600px;width: 100%;background-color: #d6ecfb">
        <form class="form_login" style="height: 300px;width: 500px;
        background: #ffffff;float: left;margin-left: 520px;border-radius: 10px;
        margin-top: 100px;box-shadow: 1px 1px 10px #9d9fa6">
          <div class="conten_form">
            <!--标题-->
            <div class="title" style="padding: 10px 200px">
                <h1>请登录</h1>
            </div>
            <!--账号-->
            <div class="username" style="margin-left: 90px;margin-top: 10px;margin-bottom: 20px">
              账号：<el-input v-model="UserInfo.idCard" placeholder="请输入账号" style="width: 250px"></el-input>
            </div>
            <!--密码-->
            <div class="pwd" style="margin-left: 90px;margin-top: 20px;margin-bottom: 20px">
              密码：<el-input type="password" v-model="UserInfo.password" placeholder="请输入内容" style="width: 250px"></el-input>
            </div>
            <!--登录按钮-->
            <div class="btn_login" style="margin-left: 120px;margin-top: 40px;margin-bottom: 20px">
              <el-button type="primary" style="width: 120px; " round @click="toLogin()">登录</el-button>
              <el-button type="primary" style="width: 120px;" round @click="toClear()">重置</el-button>
            </div>
          </div>
        </form>
    </div>

    <Footer></Footer>
  </div>
</template>

<script>
  import Header from "../../components/Header";
  import Footer from "../../components/Footer";
    export default {
      name: "Login",
      data(){
        return{
          UserInfo:{},
        }
      },
      components:{
        Header,
        Footer
      },
      methods:{
        toClear(){
          this.idCard = '';
          this.password = ''
        },
        toLogin(){
            let _this = this
            console.log(this.UserInfo)
            this.$axios.post("http://localhost:8087/user/login",_this.UserInfo).then(function(res){
              alert("登陆成功！");
              _this.$router.push({name:'Admin',query:{id:res.data}})
              localStorage.setItem("id",idCard)
            }).catch(function (err) {
              // alert("登录失败！")
            })
        }
      }
    }
</script>

<style scoped>

</style>
